<template>
  <Dialog
    :title="title"
    :model-value="visible"
    max-height="200px"
    width="600px"
    :before-close="closeForm"
  >
    <Form
      :schema="schema"
      :model="item"
      @register="formRegister"
      label-width="120px"
      :isCol="false"
      :rules="rules"
    />
    <template #footer>
      <el-space>
        <el-button type="primary" @click="save">保存</el-button>
        <el-button @click="resetForm">重置</el-button>
      </el-space>
    </template>
  </Dialog>
</template>

<script>
import * as itemApi from '@/api/base/treeDicItem'
import { Dialog } from '@/components/Dialog'
import { Form } from '@/components/Form'
import { useForm } from '@/hooks/web/useForm'
const { formRegister, formMethods } = useForm()
export default {
  name: 'EditTreeDicItem',
  components: {
    Form,
    Dialog
  },
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    dicId: {
      type: String,
      default: null
    },
    parent: {
      type: Object,
      default: () => null
    },
    id: {
      type: String,
      default: null
    }
  },
  data() {
    return {
      title: '新增字典',
      item: {},
      source: null,
      rules: {
        DicText: [
          {
            required: true,
            message: '字典项文本不能为空！',
            trigger: 'blur'
          }
        ],
        DicValue: [
          {
            required: true,
            message: '字典值不能为空！',
            trigger: 'blur'
          }
        ]
      }
    }
  },
  watch: {
    formRegister,
    visible: {
      handler(val) {
        if (val) {
          this.reset()
        }
      },
      immediate: true
    }
  },
  methods: {
    formRegister,
    initScheme() {
      const list = [
        {
          field: 'ParentValue',
          label: '字典项文本',
          component: 'TreeDicItem',
          componentProps: {
            dicId: this.dicId,
            disabled: this.id != null,
            isChioseEnd: false,
            placeholder: '父级字典项',
            on: {
              change: this.prtChange
            }
          }
        },
        {
          field: 'DicText',
          label: '字典项文本',
          component: 'Input',
          componentProps: {
            maxlength: 100,
            placeholder: '文本说明'
          }
        }
      ]
      if (this.id == null) {
        list.push({
          field: 'IsAuto',
          label: '值自动生成',
          component: 'Switch',
          componentProps: {
            on: {
              change: (val) => {
                this.item.IsAuto = val
                this.initScheme()
              }
            }
          }
        })
      }
      if (this.item.IsAuto == false) {
        list.push({
          field: 'DicValue',
          label: '字典项值',
          component: 'Input',
          componentProps: {
            maxlength: 20,
            disabled: this.id != null,
            placeholder: '字典项值'
          }
        })
      }
      this.schema = list
    },
    prtChange(val, e) {
      if (val == null) {
        this.item.ParentId = null
      } else {
        this.item.ParentId = val
      }
    },
    async save() {
      const data = await formMethods.validate()
      if (data == null) {
        return
      } else if (this.id) {
        this.set(data)
      } else {
        this.add(data)
      }
    },
    async set(data) {
      await itemApi.Set(this.id, data)
      this.$message({
        message: '更新成功!',
        type: 'success'
      })
      this.$emit('update:visible', false)
      this.$emit('close', true)
    },
    async add(data) {
      data.ParentId = this.item.ParentId
      data.DicId = this.dicId
      await itemApi.Add(data)
      this.$message({
        message: '添加成功!',
        type: 'success'
      })
      this.$emit('update:visible', false)
      this.$emit('close', true)
    },
    async reset() {
      if (this.id == null) {
        this.title = '新增字典项'
        this.source = null
        if (this.parent != null) {
          this.item = {
            IsAuto: true,
            ParentValue: this.parent.DicValue,
            ParentId: this.parent.Id
          }
        } else {
          this.item = {}
        }
      } else {
        const data = await itemApi.Get(this.id)
        this.source = data
        this.item = data
        this.item.IsAuto = false
        this.title = '编辑字典项-' + data.DicText
      }
      this.initScheme()
      formMethods.setValues(this.item)
    },
    closeForm() {
      this.$emit('update:visible', false)
      this.$emit('close', false)
    },
    resetForm() {
      if (this.id == null) {
        this.item = {}
      } else {
        this.item = this.source
      }
      formMethods.setValues(this.item)
    }
  }
}
</script>
